<!DOCTYPE html>
<html>
<head>
    {include file="layout:_meta" /}
</head>
<body>

<div class="layui-form" lay-filter="layuiadmin-form-admin" id="layuiadmin-form-admin" style="padding: 20px 30px 0 0;">
    <div class="layui-form-item">
        <div class="layui-inline">
            <label class="layui-form-label">订单编号</label>
            <div class="layui-input-inline">
                <input type="text" placeholder="" lay-reqtext="" readonly="readonly"
                       autocomplete="off" value="{:isset($order.sn)?$order.sn:''}" class="layui-input"
                       style="border: none;">
            </div>
        </div>
        <div class="layui-inline">
            <label class="layui-form-label">下单时间</label>
            <div class="layui-input-inline">
                <input type="text" class="layui-input" nplaceholder="yyyy-MM-dd HH:mm:ss"
                       value="{:isset($order.create_time)?$order.create_time:''}" readonly="readonly"
                       style="border: none;">
            </div>
        </div>
        <div class="layui-inline">
            <label class="layui-form-label">结束时间</label>
            <div class="layui-input-inline">
                <input type="text" class="layui-input" placeholder="yyyy-MM-dd HH:mm:ss"
                       value="{:isset($order.update_time)?$order.update_time:''}" readonly="readonly"
                       style="border: none;">
            </div>
        </div>
    </div>
    <div class="layui-form-item">
        <div class="layui-inline">
            <label class="layui-form-label">实付金额</label>
            <div class="layui-input-inline">
                <input type="text" class="layui-input" placeholder=订单实付金额"
                       value="{:isset($order.price)?$order.price:''}" readonly="readonly"
                       style="border: none;">
            </div>
        </div>
        <div class="layui-inline">
            <label class="layui-form-label">订单状态</label>
            <div class="layui-input-inline">
                {if condition="isset($order.state)&& $order.state eq 0"}
                <div class="layui-input" readonly="readonly" style="border: none;color: red;line-height:38px;">订单取消
                </div>
                {elseif $order.state eq 1 /}
                <div class="layui-input" readonly="readonly" style="border: none;color: #40AFFE;line-height:38px;">
                    待接订单
                </div>
                {elseif $order.state eq 2 /}
                <div class="layui-input" readonly="readonly" style="border: none;color: #40AFFE;line-height:38px;">
                    已接订单
                </div>
                {elseif $order.state eq 3 /}
                <div class="layui-input" readonly="readonly" style="border: none;color: #40AFFE;line-height:38px;">
                    订单完成
                </div>
                {/if}
            </div>
        </div>
        <div class="layui-inline">
            <label class="layui-form-label">付款状态</label>
            <div class="layui-input-inline">
                {if condition="isset($order.pay_state)&& $order.pay_state eq '0'"}
                <div class="layui-input" readonly="readonly" style="border: none;color: red;line-height:38px;">未付款</div>
                {else /}
                <div class="layui-input" readonly="readonly" style="border: none;color: #40AFFE;line-height:38px;">已付款
                </div>
                {/if}
            </div>
        </div>
    </div>
    <fieldset class="layui-elem-field layui-field-title" style="margin-top: 20px;">
        <legend>赠送商品</legend>
    </fieldset>
    <div id="goods" class="demo-transfer" style="margin-left: 20px; width: 512px;float:left;"></div>
    <span id="demoText" style="float: left; margin-right: 20px;"></span>

    <div class="layui-form-item layui-hide">
        <input type="hidden" name="id" value="{:isset($list['id'])?$list['id']:''}">
        <input type="hidden" name="order_id" value="{:isset($list['order_id'])?$list['order_id']:$order_id}">
        <input type="hidden" name="token" value="{:isset($list['token'])?$list['token']:''}">
        <input type="button" lay-submit lay-filter="addEdit" id="addEdit" value="确认">
    </div>
</div>
{include file="layout:_footer" /}
<script>
    layui.config({
        base: '__static__/admin/' //静态资源所在路径
    }).extend({
        index: 'lib/index' //主入口模块
    }).use(['index', 'form', 'transfer'], function () {
        var form = layui.form, $ = layui.$, transfer = layui.transfer;
        var data1 = [];
        goods();
        //模拟数据
        // var data1 = [
        //     {"value": "1", "title": "李白"}
        //     , {"value": "2", "title": "杜甫"}
        //     , {"value": "3", "title": "苏轼"}
        //     , {"value": "4", "title": "李清照"}
        //     , {"value": "5", "title": "鲁迅", "disabled": true}
        //     , {"value": "6", "title": "巴金"}
        //     , {"value": "7", "title": "冰心"}
        //     , {"value": "8", "title": "矛盾"}
        //     , {"value": "9", "title": "贤心"}
        // ];
        //获取商品列表
        function goods() {
            $.ajax({
                async: false,
                type: 'POST',
                url: "{:url('order/give_goods')}",
                data: {},
                success: function (data) {
                    if (data.code == 200) {
                        data1 = data.data;
                    } else {
                        msg = data.msg;
                    }
                }
            });
        }

        var cols = [
            {type: 'checkbox', fixed: 'left'}
            , {field: 'classCode', title: '班级编码', align: 'center'}
            , {
                field: '', title: '班级名称', align: 'center', templet: function () {
                    return className;
                }
            }
            , {field: 'sNum', title: '学号', align: 'center'}
            , {field: 'sName', title: '学生名称', align: 'center'}
            //, { field: 'age', title: '年龄', align: 'center' }
            //, { field: 'sex', title: '性别', align: 'center' }
            //, { field: 'createdTime', title: '创建时间', sort: true, templet: function (d) { return changeBJTime(d.createdTime); }, align: 'center' }
        ];
        //表格配置文件
        var tabConfig = {'page': true, 'limit': 10, 'limits': [20, 50, 100], 'height': 600};
        //显示搜索框
        transfer.render({
            elem: '#goods'
            // ,parseData: function(res){//数据参数来源data1转换处理
            //     return {
            //         "value": res.value //data1属性
            //         ,"title": res.title//data1属性
            //         ,"disabled":res.disabled // false  //是否禁用
            //         ,"checked":res.checked// false //是否选中
            //     }
            // }
            , cols: cols
            , data: data1
            , title: ['商品列表', '赠送列表']
            , tabConfig: tabConfig //表格配置项 支持layui数据表格所有配置
            , showSearch: true

            , onchange: function (data, index) {
                console.log(data); //得到当前被穿梭的数据
                console.log(index); //如果数据来自左边，index 为 0，否则为 1
                ff();
            }
            , id: 'goodsinfo'
        })

        function ff() {
            var getData = transfer.getData('goodsinfo'); //唯一标识
            console.log(getData.length,'========>444444<');
           var demoText = $('#demoText');
            var html ='';
            // if(getData.length > 1){

                for (var i=0;i<getData.length;i++){
                    // html=html + "商品标题 " + getData[i].title + "<br>";
                    html=html +   "<d style='font-weight: bold;color: #40AFFE;'>"+getData[i].title + "</d><input type='hidden' name='goods_id[]' value=' " + getData[i].value + "'>";
                    html=html + "<span style='width: 30px;display: block'></span>";
                    html=html + "赠送数量：<input type='number' name='goods_num[" + getData[i].value + "]' value='' style='margin-bottom: 10px;border: 1px solid #DDD;padding: 5px;border-radius: 5px;'><br>";
                }
                // document.getElementById("demo").innerHTML=x;

            // }else {
            //     html=html +   "<d style='font-weight: bold;color: #40AFFE;'>"+getData[0].title + "</d><input type='hidden' name='goods_id[]' value=' " + getData[0].value + "'>";
            //     html=html + "<span style='width: 30px;display: block'></span>";
            //     html=html + "赠送数量：<input type='number' name='goods_num[ " + getData[0].value + "]' value='' style='margin-bottom: 10px;border: 1px solid #DDD;padding: 5px;border-radius: 5px;'><br>";
            // }

            // document.getElementById("demoText").innerHTML=html;
            demoText.html(html);
         //   layer.alert(JSON.stringify(getData));
        }

    })
</script>
</body>
</html>